<template>
    <div id="admin">
        <el-container>
            <el-aside width="300px" style="padding: 15px">
                <el-menu
                        :default-active="active"
                        class="el-menu-vertical-demo"
                        router
                        background-color="#272727"
                        text-color="#fff"
                        active-text-color="#ffd04b">
                    <el-menu-item index="/admin/userAdmin">
                        <i class="el-icon-user-solid"></i>
                        <span slot="title">用户管理</span>
                    </el-menu-item>
                    <el-menu-item index="/admin/articleAdmin">
                        <i class="el-icon-tickets"></i>
                        <span slot="title">公告管理</span>
                    </el-menu-item>
                    <el-menu-item index="/admin/videoAdmin">
                        <i class="el-icon-video-play"></i>
                        <span slot="title">视频管理</span>
                    </el-menu-item>
                </el-menu>
            </el-aside>
            <el-main>
                <div class="box-card">
                    <router-view></router-view>
                </div>
            </el-main>
        </el-container>

    </div>
</template>

<script>
    import {Loading, Message, MessageBox} from 'element-ui';
    export default {
        name: "admin",
        data(){
            return{
                active: '/admin/userAdmin'
            }
        },
        created(){
            let routepath = this.$route.path;
            this.active = routepath;
        }
    }
</script>

<style scoped>
    .el-menu{
        border-right: none;
    }
    .box-card{
        margin: 50px;
    }
    #manage .el-table th, .el-table .el-table__row{
        background: #272727;
    }
</style>
